<head>
    <meta charset="UTF-8">
    <title>新用户注册</title>
    <link rel="stylesheet" href="./style.css">
</head>

<body>
    <div id="main">
        <header class="header">User registration page</header>
        <selection id="form" class="selection">
            <div class="item">
                <label>用户名:</label>
                <input type="text" id="username" class="inputText" placeholder="请输入用户名" onfocus="YHMonfocu()"
                    onblur="YHMonblus()" />
                <span id="YHMerror">
                </span>
            </div>

            <div class="item">
                <label>密码:</label>
                <input type="password" id="password" class="inputText" placeholder="请输入密码" onfocus="MMonfocu()"
                    onblur="MMonblus()" />
                <span id="MMerror">
                </span>
            </div>
            <div class="item">
                <label>确认密码:</label>
                <input type="password" id="confirmPassword" class="inputText" placeholder="请确认密码" onfocus="QRMMonfocu()"
                    onblur="QRMMonblus()" />
                <span id="QRMMerror">
                </span>
            </div>
            <div class="item">
                <label>性别:</label>
                <input type="radio" name="gender" value="male" onfocus="XBonfocu()" onblur="XBonblus()"
                    checked="true" />男
                <input type="radio" name="gender" value="female" onfocus="XBonfocu()" onblur="XBonblus()" />女
                <span id="XBerror">
                </span>
            </div>
            <div class="item">
                <label>爱好:</label>
                <input type="checkbox" name="hobby" value="Dancing" onfocus="AHonfocu()" onblur="AHonblus()" />唱歌
                <input type="checkbox" name="hobby" value="Sing" onfocus="AHonfocu()" onblur="AHonblus()" />跳舞
                <input type="checkbox" name="hobby" value="Sleeping" onfocus="AHonfocu()" onblur="AHonblus()" />读书
                <input type="checkbox" name="hobby" value="Running" onfocus="AHonfocu()" onblur="AHonblus()" />跑步
                <span id="AHerror">
                </span>
            </div>
            <div class="item">
                <label>联系电话:</label>
                <input type="text" id="phone" class="inputText" placeholder="请输入联系电话" onfocus="LXDHonfocu()"
                    onblur="LXDHonblus()" />
                <span id="LXDHerror">
                </span>
            </div>
            <div class="item">
                <label>电子邮箱:</label>
                <input type="email" id="email" class="inputText" placeholder="请输入电子邮箱" onfocus="DZYXonfocu()"
                    onblur="DZYXonblus()" />
                <span id="DZYXerror">
                </span>
            </div>
            <div class="item" style="justify-content:center;">
                <button id="sumbit" style="margin-right:10px;">提交</button>
                <button id="cancel" style="margin-left:10px;">取消</button>
            </div>
        </selection>
    </div>

    <script src="./index.js"></script>
</body>

</html>